<template>
	
	<el-row>
		<el-col :span="2"/>
		<el-col :span="20">
			<el-card>
				<el-row>
					<el-col :span="3">
						<h2 style="text-align: left; font-family: Helvetica Neue; color: darksalmon; margin: 10px 0 0 100px; padding: 0;">视</h2>
						<h2 style="text-align: left; font-family: Helvetica Neue; color: darksalmon; margin: 0 0 0 100px;padding: 0">频</h2>
						<h2 style="text-align: left; font-family: Helvetica Neue; color: darksalmon; margin: 0 0 0 100px;padding: 0">介</h2>
						<h2 style="text-align: left; font-family: Helvetica Neue; color: darksalmon; margin: 0 0 0 100px;padding: 0">绍</h2>
					</el-col>
					<el-col :span="21">
						<video :src="require('/src/assets/vidio'+this.url+this.exts)" controls='controls' style="float: left;">
							您的浏览器不支持 video 标签。
						</video>
					</el-col>
					
				</el-row>
			</el-card>	
		</el-col>
		<el-col :span="2"/>
	</el-row>
	
	
</template>

<script>
	export default {
		data() {
			return {
				//视频后缀
				exts:".mp4",
				//视频目录
				url: "",
				
			}
		},

		created() {
			this.url = this.$route.path
		},

		watch: {
			// 监听路由变化
			"$route.path": function(newVal) {
				this.url = newVal;
			}
		}
	}
</script>

<style>
</style>
